import {
	Primary,
	Controls,
	Stories,
	Meta,
	Description,
} from '@storybook/addon-docs/blocks';
import DropdownActions from './DropdownActions.vue';

import * as DropdownActionsStories from './DropdownActions.stories.js';

<Meta of={DropdownActionsStories} />

# Dropdown Actions

## Usage

This component renders a dropdown menu that displays a list of actions. To use an ellipsis menu, set `buttonVariant` to `ellipsis`. Otherwise, the `label` prop will be used as the dropdown/button text.

## Accesibility

When the ellipsis menu is enabled by setting `buttonVariant` to `ellipsis`, the `label` prop provides descriptive text for the "More Options" icon. In this case, the `ariaLabel` prop can be used to further specify the function of the button for screen readers.

For dropdowns with text, you can provide an `ariaLabel` prop to set the `aria-label` attribute on the dropdown button, ensuring that it is fully described for screen readers. This enhances accessibility without relying solely on the surrounding visual context.

<Primary />
<Controls />
<Stories />
